<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<meta name="viewport" content="width=device-width, initial-scale=1,maximum-scale=1,user-scalable=no">
		<meta name="apple-mobile-web-app-capable" content="yes">
		<meta name="apple-mobile-web-app-status-bar-style" content="black">
		<title>讨论区</title>
		<link rel="stylesheet" href="../css/mui.min.css">
		<script src="../js/mui.min.js"></script>
		<script src="../js/jquery.min.js"></script>
	</head>
	<body>
		<header class="mui-bar mui-bar-nav">
			<a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"></a>
			<h1 class="mui-title">讨论详情</h1>
		</header>

		<div class="mui-content" style="padding-bottom: 50px;">
			<div class="mui-card">
				<div class="mui-card-header" id="questionTitle">链表问题</div>
				<div class="mui-card-content">
					<div class="mui-card-content-inner" id="questionInfo">
						怎么实现链表反转
					</div>
				</div>
				<div class="mui-card-footer">
					<span id="questionName">张三</span>
					<span id="questionTime">2019-08-12</span>
				</div>
			</div>
			<div style="margin: 10px;">
				<h3>评论 <span id="ping">+</span></h3>
			</div>
			<div class="mui-card" id="content"></div>
			<!-- -------------------数据填充---------------------- -->
		</div>
		<script>
			mui.init({
				swipeBack: true, //启用右滑关闭功能
			});

			var dID, uID;
			mui.plusReady(function() {
				dID = plus.webview.currentWebview().dID;
				uID = plus.storage.getItem('uID');
			})

			document.getElementById("ping").addEventListener('tap', function(e) {
				e.detail.gesture.preventDefault(); //修复iOS 8.x平台存在的bug，使用plus.nativeUI.prompt会造成输入法闪一下又没了
				var btnArray = ['取消', '确定'];
				mui.prompt('发表评论：', '', '', btnArray, function(e) {
					if (e.index == 1) {
						mui.ajax({
							url: 'http://120.27.247.180:8080/School/discussion/comment',
							type: "post",
							data: {
								"dID": dID,
								"uID": uID,
								"description": e.value
							},
							dataType: "jsonp",
							contentType: "application/x-www-form-urlencoded; charset=utf-8",
							jsonp: "jsoncallback",
							success: function(data) {
								data = JSON.parse(data);
								if (data.suc) {
									mui.toast("发布成功");
									init();
								} else
									mui.toast("发布失败");
							},
							error: function() {
								mui.toast("服务器异常，请稍后再试");
							}
						});
					}
				})
			});

			var questionId;
			mui.plusReady(function() {
				questionId = plus.webview.currentWebview().dID;
				getC();
				init();
			})

			function getC() {
				mui.ajax({
					url: 'http://120.27.247.180:8080/School/discussion/queryDiscussionByDid',
					type: "post",
					data: {
						"dID": questionId
					},
					dataType: "jsonp",
					contentType: "application/x-www-form-urlencoded; charset=utf-8",
					jsonp: "jsoncallback",
					success: function(data) {
						data = JSON.parse(data);
						jQuery("#questionTitle").text(data.discussion['title']);
						jQuery("#questionInfo").text(data.discussion['description']);
						jQuery("#questionName").text(data['name']);
						var date = new Date(data.discussion['issueTime']);
						var time = date.getFullYear() + "/" + (date.getMonth() + 1) + "/" + date.getDate();
						jQuery("#questionTime").text(time);
					},
					error: function() {
						mui.toast("服务器异常，请稍后再试");
					}
				});
			}


			//加载讨论区内容
			function init() {
				mui.ajax({
					url: 'http://120.27.247.180:8080/School/discussion/queryComments',
					type: "post",
					data: {
						"dID": questionId
					},
					dataType: "jsonp",
					contentType: "application/x-www-form-urlencoded; charset=utf-8",
					jsonp: "jsoncallback",
					success: function(data) {
						var Ele = jQuery('#content');
						Ele.empty();
						data = JSON.parse(data);
						//课堂
						var Info = data.commentsList;
						var name = data.nameList;
						for (var i = 0, l = Info.length; i < l; i++) {
							var date = new Date(Info[i]['issueTime']);
							var time = date.getFullYear() + "/" + (date.getMonth() + 1) + "/" + date.getDate();
							var tempEle = '<div class="mui-card">' +
								'<div class="mui-card-content">' +
								'<div class="mui-card-content-inner">' + Info[i]['description'] + '</div></div>' +
								'<div class="mui-card-footer">' +
								'<span>' + name[i] + '</span>' +
								'<span>' + time + '</span>' + '</div></div>';
							Ele.append(tempEle);
						}
					},
					error: function() {
						mui.toast("服务器异常，请稍后再试");
					}
				});
			}
		</script>
	</body>
</html>
